//导入vue对象
import Vue from 'vue'
//导入vuex
import Vuex from 'vuex'
import {getRequest} from "../utils/api";
import { Notification } from 'element-ui';
import SockJS from 'sockjs-client';
import Stomp from 'stompjs';
import fa from "element-ui/src/locale/lang/fa";

const now = new Date();
Vue.use(Vuex)

const store = new Vuex.Store({
    //定义变量的
    state: {
        //这是我的路由数组，一会从服务器上加载下来的菜单项都放在这个数组里面去
        routes: [],
        sessions: {},
        currentSession: null,  //记录点击那个聊天人物
        filterKey: '',
        hrs: [],  //用户展示边框上的hr头像信息等
        stomp: null,  /*传递的消息*/
        currentHr: JSON.parse(window.sessionStorage.getItem("user")),
        isDot:{},
    },
    //修改变量的方法  想当于是java中的setter方法
    mutations: {
        INIT_CURRENTHR(state, hr) {
            state.currentHr = hr;
        },
        //通过方法放   state:要通过state才可以访问到上面的state变量里面的routes数组   data：传进来的参数  等下去调用只需要传data参数即可
        initRoutes(state, data) {
            state.routes = data;
        },
        changeCurrentSession(state, currentSession) {
            Vue.set(state.isDot, state.currentHr.username + '#' + currentSession.username, false);
            state.currentSession = currentSession;
        },
        addMessage(state, msg) {
            let mss = state.sessions[state.currentHr.username + '#' + msg.to];
            if (!mss) {
                //state.sessions[state.currentHr.username + '#' + msg.to] = [];
                Vue.set(state.sessions, state.currentHr.username + '#' + msg.to, []);
            }
            state.sessions[state.currentHr.username + '#' + msg.to].push({
                content: msg.content,
                date: new Date(),
                self: !msg.notSelf
            })
        },
        INIT_DATA(state) {
            //浏览器本地的历史聊天记录可再次完成
              let data = localStorage.getItem('vue-chat-session');
              //console.log(data)
              if (data) {
                  state.sessions = JSON.parse(data);
              }
        },
        //加载边侧hr信息
        INIT_HR(state, data) {
            state.hrs = data;
        }
    },
    actions: {
        connect(context) {
            //首先进行连接
            context.state.stomp = Stomp.over(new SockJS('/ws/ep'));
            context.state.stomp.connect({}, success => {
                //用来收消息，订阅,msg服务端发挥的校企
                context.state.stomp.subscribe('/user/queue/chat', msg => {
                    let receiveMsg = JSON.parse(msg.body);
                    if (!context.state.currentSession || receiveMsg.from != context.state.currentSession.username) {
                        Notification.info({
                            title: '【' + receiveMsg.fromNickname + '】发来一条消息',
                            message: receiveMsg.content.length > 10 ? receiveMsg.content.substr(0, 10) : receiveMsg.content,
                            position: 'bottom-right'
                        })
                        Vue.set(context.state.isDot, context.state.currentHr.username + '#' + receiveMsg.from, true);
                    }
                    receiveMsg.notSelf = true;
                    receiveMsg.to = receiveMsg.from;
                    context.commit('addMessage', receiveMsg);
                })
            }, error => {

            })
        },
        initData(context) {
            context.commit('INIT_DATA')
            getRequest('/chat/hrs').then(resp => {
                if (resp) {
                    context.commit('INIT_HR', resp);
                }
            })
        },

    }

})
store.watch(function (state) {
    return state.sessions
}, function (val) {
    localStorage.setItem('vue-chat-session', JSON.stringify(val));
}, {
    deep: true/*这个貌似是开启watch监测的判断,官方说明也比较模糊*/
})


export default store;